<template>
	<view>
		<uni-segmented-control :values="type" styleType="text" @clickItem="change"></uni-segmented-control>
		<view v-show="id==0">
			<view style="margin: 250rpx 0rpx;text-align: center;"  v-if="userlist[0]==null">
				<image src="../../static/zanwu.png" class="img3"></image>
			</view>
			<uni-card v-for="i in userlist" @click="go(i.user.userId)">
				<view style="display: flex;justify-content: space-between;">
					<view style="display: flex;">
						<view>
							<image :src="i.user.avatar!=''?baseUrl+i.user.avatar:'../../static/yonghu.png'" class="tx"></image>
						</view>
						<view style="margin-left: 30rpx;">
							<view style="font-size: 36rpx;font-weight: 700;margin-bottom: 20rpx;">{{i.user.nickName}}</view>
							<view style="font-size: 26rpx;">{{i.schoolName}}</view>
						</view>
					</view>
					<view>
						<button type="warn" size="mini" @click.stop="remove(i)">删除</button>
					</view>
				</view>
			</uni-card>
		</view>
		<view v-show="id==1">
			<view style="margin: 250rpx 0rpx;text-align: center;"  v-if="postbarList[0]==null">
				<image src="../../static/zanwu.png" class="img3"></image>
			</view>
			<uni-card @click="onClick(i)" :title="i.title" :sub-title="'发布日期:'+i.createtime" v-for="i in postbarList">
				<image slot='cover' :src="image" v-for="image in i.imageList.slice(0,3)"
					:class="i.imageList.length==1?'image1':(i.imageList.length==2?'image2':'image3')" @click="onClick(i)"></image>
				<view class="view1">{{i.content}}</view>
			</uni-card>
		</view>
		<view v-show="id==2">
			<view style="margin: 250rpx 0rpx;text-align: center;"  v-if="productList[0]==null">
				<image src="../../static/zanwu.png" class="img3"></image>
			</view>
			<uni-card v-for="i in productList" margin="1" padding="1" @click="productgo(i)">
				<view style="display: flex;justify-content: space-between;">
					<view style="display: flex;">
						<view>
							<image :src="i.img[0]" class="tx1"></image>
						</view>
						<view style="margin-left: 30rpx;">
							<view style="font-size: 36rpx;font-weight: 700;margin-bottom: 20rpx;">{{i.title.substring(0,7)}}</view>
							<view style="font-size: 30rpx;margin-bottom: 20rpx;font-weight: 700;">￥ {{i.price}}</view>
							<view style="font-size: 26rpx;">{{i.createDate}}</view>
						</view>
					</view>
					<view>
						<button type="warn" size="mini" @click.stop="productremove(i)">删除</button>
					</view>
				</view>
			</uni-card>
		</view>
	</view>
</template>

<script>
	import config from '@/config'
import { selectfollowuser,removefollow, selectcollectlist, removecollect, selectpostbarlist1 } from '../../api/myapi';
	export default {
		data() {
			return {
				type: ['关注的人', '点赞的帖', '收藏的商品'],
				id: 0,
				baseUrl: config.baseUrl,
				userlist:[],
				productList:[],
				postbarList:[]
			}
		},
		methods: {
			async productremove(i){
				console.log(i);
				let r = await removecollect({
					userid: uni.getStorageSync("userid"),
					productid: i.id
				})
				console.log(r);
				this.selectlist()
			},
			productgo(i){
				uni.redirectTo({
					url:'../xz/detail??id='+i.id+"&userid="+i.userid
				})
			},
			go(i){
				console.log(i);
				uni.redirectTo({
					url:'../shop/index?userid=' + i
				})
			},
			async remove(i){
				console.log(i);
				let r = await removefollow({
					userid:i.userid,
					followuserid:i.followuserid
				})
				this.$modal.msg(r.msg)
				this.selectuser()
			},
			change(i) {
				console.log(i);
				this.id = i.currentIndex
				if(this.id==0){
					this.selectuser()
				}else if(this.id==1){
					this.collectlist()
				}else if(this.id==2){
					this.selectlist()
				}
			},
			async selectuser(){
				let id = uni.getStorageSync('userid')
				console.log(id);
				let r = await selectfollowuser({userid:id})
				console.log(r);
				this.userlist = r.data
			},
			async selectlist(){
				let r = await selectcollectlist({
					userid:uni.getStorageSync('userid')
				})
				console.log(r);
				this.productList = r.data
			},
			async collectlist(){
				let r = await selectpostbarlist1({
					userid:uni.getStorageSync('userid')
				})
				console.log(r);
				this.postbarList = r.data
			},
			onClick(i){
				console.log(i);
				uni.navigateTo({
					url:'../postbar/detail?id='+i.id
				})
			}
		},
		onLoad(){
			this.selectuser()
		},
		onShow(){
			this.collectlist()
		}
	}
</script>

<style>
	.img3 {
		width: 350rpx;
		height: 350rpx;
	}
	.tx1 {
		width: 200rpx;
		height: 200rpx;
		border-radius: 20rpx;
		background-color: aquamarine;
	}
	.tx {
		width: 120rpx;
		height: 120rpx;
		border-radius: 50%;
		border: 1rpx solid #c0c0c0;
	}
	.view1 {
		height: 78rpx;
		overflow: hidden;
		
	}
	.image1 {
		width: 100%;
		margin-top: 20rpx;
		border-radius: 16rpx;
		height: 300rpx;
	}
	
	.image2 {
		width: 47%;
		margin-top: 20rpx;
		border-radius: 16rpx;
		height: 300rpx;
		margin-left: 14rpx;
		border: 1rpx solid #dcdcdc;
	}
	
	.image3 {
		width: 30%;
		margin-top: 20rpx;
		border-radius: 16rpx;
		height: 200rpx;
		margin-left: 18rpx;
		border: 1rpx solid #dcdcdc;
	}
</style>